<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Document</title>
	<script type="text/javascript" src="js/jquery-1.8.3.js"></script>
	<script type="text/javascript" src="js/layer.js"></script>
</head>
	<script type="text/javascript">
	$(function(){
		
	});
	function login(){
		layer.tips('点击一下才能显示','#usernames');
		layer.open({
		  type: 2,
		  title: '这是标题',
		  shadeClose: true,
		  shade: 0.5,
		  area: ['1000px', '600px'],
		  // content: '12345' //iframe的url
		}); 
		/*layer.alert('内容', {
		  icon: 1,
		  skin: 'layer-ext-moon' //该皮肤由layer.seaning.com友情扩展。关于皮肤的扩展规则，去这里查阅
		});*/
		/*layer.tab({
		  area: ['600px', '300px'],
		  tab: [{
		    title: 'TAB1', 
		    content: '内容1'
		  }, {
		    title: 'TAB2', 
		    content: '内容2'
		  }, {
		    title: 'TAB3', 
		    content: '内容3'
		  }]
		});*/
		var index = layer.load(0, {shade: false}); //0代表加载的风格，支持0-2
		//loading层

		var index = layer.load(1, {
		  shade: [0.1,'#fff'] //0.1透明度的白色背景
		});
	}
	</script>
<body>
<div style="margin-left:300px;">
<input type="text" name="username" id="username"><br>
<a href="javascript:;" onclick="login()">点击</a>
</div>
</body>
</html>